<template>
    <div class="app-container calendar-list-container" v-loading="loading" element-loading-text="正在导出数据">
    <!-- filter 条件查询 -->

    <el-dialog
      title="产品报检清单"
      :visible.sync="showInspection"
      @close="showInspection = false"
      width="80%"   
      center
    >
        <el-form :model="createForm" :inline="true" ref="createForm">
            <div style="display: flex;">
                <el-form-item label="工作中心" prop="type" label-width="90px">
                    <el-input v-model="createForm.type" disabled autosize style="width: 120px"/>
                </el-form-item>
                <el-form-item label="产品编码" prop="clientNumber" label-width="90px">
                    <el-input v-model="createForm.clientNumber" disabled autosize style="width: 100px"/>
                </el-form-item>
                <el-form-item label="产品版本" prop="version" label-width="90px">
                    <el-select 
                         v-model="createForm.version"   
                         filterable
                         @change="versionEnter"
                         style="width: 100px"
                         placeholder="选择版本"
                         class="ul-item">
                         <el-option v-for="item in versionList" :key="item" :value="item" :label="item"/>
                    </el-select>
                    <!-- <el-input v-model="createForm.version" autosize style="width: 100px"/> -->
                </el-form-item>
                <el-form-item label="报检数量" prop="quantityDeclared" label-width="90px">
                    <el-input v-model="createForm.quantityDeclared" disabled autosize style="width: 100px"/>
                </el-form-item>
                <el-form-item label="报检人员" prop="InspectionApplicant" label-width="90px">
                    <el-input v-model="createForm.InspectionApplicant" disabled autosize style="width: 100px"/>
                </el-form-item>
                <el-form-item label="报检时间" prop="InspectionTime" label-width="90px">
                    <el-input v-model="createForm.InspectionTime" disabled autosize/>
                </el-form-item>
                <el-form-item label-width="90px">  
                    <el-button type="primary" @click="affirmCreate">确认生成</el-button>
                </el-form-item>
            </div>
            <div style="display: flex;">
                <el-form-item label="产品条码" prop="deviceBarcode" label-width="100px">
                    <el-input v-model="createForm.deviceBarcode" clearable autosize style="width: 120px" :style="{ width: inputWid(createForm.deviceBarcode) }"/>
                </el-form-item>
                <el-form-item label="是否报检" prop="isInspectionSubmission" label-width="100px">
                    <el-select 
                         v-model="createForm.isInspectionSubmission"   
                         filterable
                         style="width: 140px"
                         placeholder="请选择是否报检"
                         class="ul-item">
                         <el-option value="已报检" label="已报检"/>
                         <el-option value="未报检" label="未报检"/>
                    </el-select>
                </el-form-item>
                <el-form-item label="工单号" prop="workOrderNo" label-width="80px">
                    <el-input v-model="createForm.workOrderNo" clearable autosize style="width: 120px" :style="{ width: inputWid(createForm.workOrderNo) }"/>
                </el-form-item>
                
                <el-form-item label="工段简称" prop="sectionAbbreviation" label-width="80px">
                    <el-select v-model="createForm.sectionAbbreviation" @focus="iationFocus" filterable clearable style="width:120px">
                      <el-option :value="item" :label="item" v-for="(item,index) in this.departList" :key="index"/>
                    </el-select>
                    <!-- <el-input v-model="createForm.sectionAbbreviation" clearable autosize style="width: 120px" :style="{ width: inputWid(createForm.sectionAbbreviation) }"/> -->
                </el-form-item>
                <el-form-item label-width="100px">
                    <el-button type="primary"  @click="clickInspection(1)">查询</el-button>
                </el-form-item>
            </div>
        </el-form>

        <el-link type="danger" :underline="false">输入产品版本按住回车，列表数据及修改</el-link>
        <el-table :data="inventoryList"
            @selection-change="SelectionChange1"
            @select="selectRow1" v-loading="loadinginventoryList" element-loading-text="给我一首歌的时间" stripe border fit highlight-current-row style="width: 100%;margin-top:15px;">
          <el-table-column label="序号" type="index" align="center" width="80px"/>
          <el-table-column type="selection" width="70" align="center"></el-table-column>
          <el-table-column label="产品条码"  prop="deviceBarcode1" align="center" width="120"/>
          <el-table-column label="版本"  prop="version" align="center"/>
          <el-table-column label="生产工段"  prop="sectionNo" align="center"/>
          <el-table-column label="组长"  prop="sectionManagerJobNumber" align="center"/>
          <el-table-column label="工单号"  prop="workOrderNo" align="center"/>
          <el-table-column label="FQC是否成功"  prop="checkPassEms" align="center">
            <template slot-scope="scope" >
                <div style="color: #000;">{{ scope.row.checkPassEms == 1 ? '检验合格' : scope.row.checkPassEms == 0 ? '未检测' : ''}}</div>
            </template>
          </el-table-column>
          <!-- <el-table-column label="FQC问题及处理结果"  prop="disqualificationDesc" align="center" width="140" show-overflow-tooltip/> -->
          <el-table-column label="FQC问题及处理结果"  prop="disqualificationDescQC" align="center" width="140" show-overflow-tooltip>
            <template slot-scope="scope" >
                <div :style="{color: isSubstringPresent(scope.row.disqualificationDescQC) ? 'red' : '#000' }">{{ scope.row.disqualificationDescQC }}</div>
            </template>
          </el-table-column>
          <el-table-column label="FQC检验人"  prop="qcUserName" align="center">
            <template slot-scope="scope" >
                <div style="color: #000;">{{ scope.row.qcUserName }}</div>
            </template>
          </el-table-column>
          <el-table-column label="FQC检验时间"  prop="checkPassEmsTime" align="center" width="140">
            <template slot-scope="scope" >
                <div style="color: #000;">{{ scope.row.checkPassEmsTime }}</div>
            </template>
          </el-table-column>
          <el-table-column label="OQC/OBA是否成功"  prop="checkPass" align="center" width="140">
            <template slot-scope="scope" >
                <div style="color: #09093b;">{{ scope.row.checkPass == 1 ? '检验合格' : scope.row.checkPass == 0 ? '未检测' : ''}}</div>
            </template>
          </el-table-column>
          <el-table-column label="OQC/OBA问题及处理结果"  prop="disqualificationDescOBAAndOQC" align="center" width="140" show-overflow-tooltip>
            <template slot-scope="scope" >
                <div :style="{color: isSubstringPresent(scope.row.disqualificationDescOBAAndOQC) ? 'red' : '#09093b' }">{{ scope.row.disqualificationDescOBAAndOQC }}</div>
            </template>
          </el-table-column>
          <el-table-column label="OQC/OBA检验人"  prop="oqcUserName" align="center" width="140">
            <template slot-scope="scope" >
                <div style="color: #09093b;">{{ scope.row.oqcUserName }}</div>
            </template>
          </el-table-column>
          <el-table-column label="OQC/OBA检验时间"  prop="checkPassTime" align="center" width="140">
            <template slot-scope="scope" >
                <div style="color: #09093b;">{{ scope.row.checkPassTime }}</div>
            </template>
          </el-table-column>
        </el-table>
        <div><el-link type="danger" :underline="false">注意1：qc没有检验不会查询出来</el-link></div>
        <div><el-link type="danger" :underline="false">注意2：如果想选择不同分页的，必须把页容量拉到最大值，查出更多进行选择！</el-link></div>
        <div class="pagination-container">
      <el-pagination
        background  
        @size-change="InspectionSizeChange"
        @current-change="InspectionCurrentChange"
        :current-page="listQuery.page"
        :page-sizes="[5,10, 50, 100, 500,1000,5000,10000]"
        :page-size="listQuery.limit"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total11"
      ></el-pagination>
    </div>

    </el-dialog>

    <div class="filter-container">
      <!-- style="width: 150px;margin-right:15px;" -->

        <el-select v-model="param.type" placeholder="工作中心" class="ul-item" filterable clearable style="margin-right: 10px;width: 120px">
            <el-option v-for="(item,index) in typeList" :key="index" :label="item.name" :value="item.id"> </el-option>
        </el-select>

        <el-input
            clearable
            style="margin-right: 10px;width: 120px"
            v-model="param.clientNumber"
            placeholder="客户编码"
        ></el-input>

        <el-input
            @keyup.enter.native="getData"
            clearable
            style="margin-right: 10px;width: 120px"
            v-model="param.sectionNo"
            placeholder="生产工段"
        ></el-input>

        <el-input
            @keyup.enter.native="getData"
            clearable
            style="margin-right: 10px;width: 120px"
            v-model="param.produceNo"
            placeholder="品号"
        ></el-input>


        <el-input
            @keyup.enter.native="getData"
            clearable
            style="margin-right: 10px;width: 120px"
            :style="{ width: inputWid(param.deviceBarcode1) }"
            v-model="param.deviceBarcode1"
            placeholder="产品条码"
        ></el-input>

        <el-input
            @keyup.enter.native="getData"
            clearable
            style="margin-right: 10px;width: 120px"
            v-model="param.version"
            placeholder="版本号"
        ></el-input>

        <el-input
            @keyup.enter.native="getData"
            clearable
            style="margin-right: 10px;width: 120px"
            v-model="param.workOrderNo"
            placeholder="工单号码"
        ></el-input>

        <el-date-picker
          v-model="dateOptions"
          type="datetimerange"
          value-format="yyyy-MM-dd HH:mm:ss"
          format="yyyy-MM-dd HH:mm:ss"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions">
        </el-date-picker>

        <el-button type="primary" v-waves icon="el-icon-search" @click="getData">搜索</el-button>
        <el-button type="primary" v-waves @click="generateInspection" :loading="oneLoading">生成报检单</el-button>
        <el-button
            type="button"
            v-waves
            class="el-button el-button--warning"
            @click="cancelSubmit"
        >
        重置</el-button>

    </div>

    <!-- table 表格 -->
    <el-table  :data="tableInfo" v-loading="loadingList" element-loading-text="给我一首歌的时间" stripe border fit highlight-current-row style="width: 100%;margin-top:15px;">
      <el-table-column  label="序号" type="index" align="center" width="80px"/>
      <el-table-column label="工作中心"  prop="workCenter" align="center"/>
      <el-table-column label="生产工段"  prop="sectionNo" align="center"/>
      <el-table-column label="产品品号"  prop="produceNo" align="center"/>
      <el-table-column label="客户编码"  prop="clientNumber" align="center"/>
      <el-table-column label="版本号"  prop="version" align="center"/>
      <el-table-column label="工单号码"  prop="workOrderNo" align="center"/>
      <el-table-column label="报检条码"  prop="" align="center" width="130">
        <template slot-scope="scope" >
                <el-button size="mini" type="primary" @click="lookCode(scope.row)">查看报检条码</el-button>
        </template>
      </el-table-column>
      <el-table-column label="工单台数"  prop="planNumber" align="center"/>
      <el-table-column label="报检台数"  prop="inspectionSubmissionNumber" align="center">
        <template slot-scope="scope" >
            {{ scope.row.customerInspectionFormDeviceBarcodeList.length }}
        </template>
      </el-table-column>
      <el-table-column label="班组长"  prop="sectionManagerJobNumber" align="center"/>
      <el-table-column label="FQC人员"  prop="qcJobNumber" align="center"/>
      <el-table-column label="报检人员"  prop="inspectionSubmissionJobNumber" align="center"/>
      <el-table-column label="报检日期"  prop="inspectionSubmissionDate" align="center"/>
      <el-table-column label="操作" fixed="right" align="center" width="130">
        <template slot-scope="scope" >
            <div class="fx">
                <el-button size="mini" type="primary" @click="hExportExcel('XZ',scope.row)">下载</el-button>
                <el-button
                    v-if="userInfo.roleId == 14 || userInfo.roleId == 44"
                    icon="el-icon-delete"
                    class="el-button el-button--danger"
                    style="font-size: 15px;"
                    @click="handleDelete(scope.row,scope.$index)"
                ></el-button>
            </div>
        </template>
      </el-table-column>
    </el-table>

    <!-- 报检条码弹窗 -->
    <el-dialog
      title="报检条码"
      :visible.sync="showCode"
      @close="showCode = false"
      width="35%"
    >
        <el-table  :data="CodeList" stripe border fit highlight-current-row style="width: 100%;">
          <el-table-column  label="序号" type="index" align="center" width="80px"/>
          <el-table-column label="报检条码"  prop="deviceBarcode" align="center"/>
        </el-table>
    </el-dialog>

   <!-- pagination 分页 -->
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="listQuery.page"
        :page-sizes="[5,10, 20, 30, 40, 100, 300, 500]"
        :page-size="listQuery.limit"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>

    <el-divider></el-divider>

    <el-button style="margin-right: 10px" type="success" size="small" @click="hExportExcel('ALL')">导出数据Excel</el-button>

  </div>
</template>

<script>
import { findScanCustomerInspectionForm,inspectionFormFind,inspectionFormAdd,inspectionFormDel } from "@/api/checkSetting"
import { checkWorkSecInfo } from '@/api/workSection.js'
export default {
    name: 'customerInspection',
    data () {
        return {
            listQuery: {
                page: 1,                                    //页码
                limit: 10                                   //每页多少条记录
            },
            listQuer2: {
                page: 1,                                    //页码
                limit: 10                                   //每页多少条记录
            },
            param: {
                code: '',                      
                content: ''                    
            },
            total: 0,                                      //数据的总数
            total11: 0,
            tableInfo: [],
            inventoryList:[],                             // 清单列表
            loadingList: false,
            loadinginventoryList: false,
            loading: false,
            createForm: {version:'',isInspectionSubmission:'未报检'},
            updForm: {},
            props: { multiple: true },
            dateOptions: this.getNowTime(),
            pickerOptions: {                            // 选择时间范围
              shortcuts: [{
                text: '最近一周',
                onClick(picker) {
                  const end = new Date();
                  const start = new Date();
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                  picker.$emit('pick', [start, end]);
                }
              }, {
                text: '最近一个月',
                onClick(picker) {
                  const end = new Date();
                  const start = new Date();
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                  picker.$emit('pick', [start, end]);
                }
              }, {
                text: '最近三个月',
                onClick(picker) {
                  const end = new Date();
                  const start = new Date();
                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                  picker.$emit('pick', [start, end]);
                }
              }]
            },
            showCode: false,
            userInfo: this.$store.state.user.userInfo,
            barcodeType1List: [],
            accessTypeList: ['出库','入库'],
            barcodeType3List: [],
            showInspection: false,         // 产品报检清单弹框
            typeList:[{name:'装配车间',id:1},{name:'EMS总装车间',id:2}],
            oneLoading: false,
            rowSelect1:[],         // 选择列表
            CodeList:[],           // 条码列表
            versionList:['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'],
            departList: []
        } 
    },
    computed: {
      inputWid() {
        return function (value) {   
            if(!value || (value.length <= 10)){
              return '120px'
            } else {
              return (120 + (String(value).length-10)*6) + 'px'
            }
        }
      }
    },
    methods: {
        // 线体简称获取列表
        async iationFocus(){
            const res = await checkWorkSecInfo({page: 1,limit: 10000})
            console.log(res.data.records)
            const sectionAbbreviation = res.data.records.map(item => item.sectionAbbreviation)
            this.departList = [...new Set(sectionAbbreviation)]
        },
        //初始默认执行(重点)，返回日期格式YYYY-MM-DD HH:MM:SS
      getNowTime() {
        let dateTime = +new Date()+8*3600*1000
        const start = new Date(dateTime - 3600 * 1000 * 24 * 7)
            .toISOString()
            .replace('T', ' ')
            .split('.')[0]
            // .substring(0,10) //默认开始时间7天前
        const end = new Date(dateTime)
            .toISOString()
            .replace('T', ' ')
            .split('.')[0]
            // .substring(0,10)//默认结束时间当前时间
        console.log([start, end])
        return [start, end]
        },
        // 点击查看条码
        lookCode(row){
            this.CodeList = row.customerInspectionFormDeviceBarcodeList
            this.showCode = true
        },
        isSubstringPresent(e) {
          if(!e)return
          return e.includes('--未闭环;');
         },
        // 点击确认生成
        async affirmCreate(){
            if(!this.rowSelect1.length)return this.$message.warning('请选择报检清单！')
            for(const item of this.rowSelect1){
                if(!item.version)return this.$message.warning('请填写版本！')
                if(!item.checkPass || !item.checkPassEms)return this.$message.warning('勾选的条码FQC/OQC检验未完成,无法报检!')
                // 还需要校验一个  问题及处理结果有没有闭环
                if(item.disqualificationDescQC){
                    if(item.disqualificationDescQC.includes("--未闭环;")){
                        return this.$message.warning('勾选的条码中有质量问题未闭环，无法报检!')
                    }
                }
                if(item.disqualificationDescOBAAndOQC){
                    if(item.disqualificationDescOBAAndOQC.includes("--未闭环;")){
                        return this.$message.warning('勾选的条码中有质量问题未闭环，无法报检!')
                    }
                }
            }
            this.rowSelect1.forEach(item =>{
                item.inspectionSubmissionJobNumber = this.userInfo.userName
                item.inspectionSubmissionDate = this.setNowTime()
                item.inspectionSubmissionNumber = this.createForm.quantityDeclared
             })
            const data = await inspectionFormAdd({objectMap:this.rowSelect1})
            console.log(data)
            let errmsg = data.msg
            if(data.code == '500') return
            if(data.code != '1') return this.$message.error(errmsg)
            this.$message.success(errmsg)
            this.showInspection = false
            this.handleFilter()
        },
        selectRow1(selection, row) {
          console.log("单选", selection, row)
          this.rowSelect1 = selection;
          this.$set(this.createForm,'quantityDeclared',this.rowSelect1.length)
        },
        SelectionChange1(select){
          console.log("全选",select)
          this.rowSelect1 = select;
          this.$set(this.createForm,'quantityDeclared',this.rowSelect1.length)
        },
        // 版本改变
        versionEnter(e){
            console.log('e',e)
            const arr = this.inventoryList.map(item =>  {
              return { ...item, version: this.createForm.version }; // 使用对象解构和扩展运算符添加新的字段 'age'
            })
            this.inventoryList = arr
        },
        // 点击产品报检清单
        generateInspection(){
            if(!this.param.clientNumber || !this.param.type) return this.$message.warning('请填写工作中心和客户编码！')
            this.oneLoading = true
            this.listQuer2.page = 1
            this.listQuer2.limit = 10
            this.clickInspection()
        },
        async clickInspection(e){
            let query = {
                clientNumber: this.param.clientNumber,
                type: this.param.type,
                page: this.listQuer2.page,  
                limit: this.listQuer2.limit,
            }
            if(e){
                query.isInspectionSubmission = this.createForm.isInspectionSubmission == '已报检' ? 1 : 0
                query.deviceBarcode = this.createForm.deviceBarcode
                query.workOrderNo = this.createForm.workOrderNo
                query.sectionAbbreviation = this.createForm.sectionAbbreviation
                query.page = 1
                query.limit = this.listQuer2.limit
            }else {
                query.isInspectionSubmission = 0
            }
            this.loadinginventoryList = true
            const res = await findScanCustomerInspectionForm(query)
            console.log(res)
            this.loadinginventoryList = false
            this.oneLoading = false
            this.inventoryList = res.data.records
            this.param.type == 1 ? this.createForm.type = '装配车间' : this.createForm.type = 'EMS总装车间'
            this.createForm.clientNumber = this.param.clientNumber
            this.createForm.quantityDeclared = 0
            this.total11 = res.data.total
            this.$set(this.createForm,'quantityDeclared',0)
            this.createForm.InspectionApplicant = this.userInfo.userName
            this.createForm.InspectionTime = this.setNowTime()
            this.createForm.version = ''
            this.showInspection = true
        },
        // 当前时间
        setNowTime() {
            let date = new Date()
            // 获取年、月、日、时、分、秒  
            const year = date.getFullYear();  
            const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份是从0开始的  
            const day = String(date.getDate()).padStart(2, '0');  
            const hour = String(date.getHours()).padStart(2, '0');  
            const minute = String(date.getMinutes()).padStart(2, '0');  
            const second = String(date.getSeconds()).padStart(2, '0');  
            return `${year}-${month}-${day} ${hour}:${minute}:${second}`;   
        },
        getData(){
          this.listQuery.page = 1
          this.listQuery.limit = 10
          this.handleFilter()
        },
        async handleFilter() {
            this.loadingList = true
            let query = Object.assign({},this.listQuery)
            if(this.param.type == 1){ query.workCenter = '装配车间'}
            if(this.param.type == 2){ query.workCenter = 'EMS总装车间'}
            if(this.param.clientNumber){ query.clientNumber = this.param.clientNumber}
            if(this.param.sectionNo){ query.sectionNo = this.param.sectionNo}
            if(this.param.produceNo){ query.produceNo = this.param.produceNo}
            if(this.param.version){ query.version = this.param.version}
            if(this.param.deviceBarcode1){ query.deviceBarcode1 = this.param.deviceBarcode1}
            if(this.param.workOrderNo){ query.workOrderNo = this.param.workOrderNo}
            if(this.dateOptions) {
              if(this.dateOptions.length) {
                  query.startTime = this.dateOptions[0]
                  query.endTime = this.dateOptions[1]
              }
            }
            let data = await inspectionFormFind(query)
            let errmsg = data.msg
            this.loadingList = false
            if(data.code == '500') return
            if(data.code != '1') return this.$message.error(errmsg)
            this.total = data.data.count
            this.tableInfo = data.data.list
        },
        // table表单下方的页码组件改变每页显示的数据条数
        handleSizeChange(val) {
          this.listQuery.limit = val
          this.handleFilter()
        },
        InspectionSizeChange(val) {
        this.listQuer2.limit = val
        this.clickInspection(1)
        },
        // table表单下方的页码组件改变页面
        handleCurrentChange(val) {
          this.listQuery.page = val
          this.handleFilter()
        },
        InspectionCurrentChange(val) {
          this.listQuer2.page = val
          this.clickInspection(1)
        },
        transformDat(res) {
          const mapInfo = {
            index: '序号',
            workCenter: '工作中心',
            sectionNo: '生产工段',
            produceNo: '产品品号',
            clientNumber: '客户编码',
            version: '版本号',
            workOrderNo: '工单号码',
            deviceBarcode: '报检条码',
            planNumber: '工单台数',
            inspectionSubmissionNumber: '报检台数',
            sectionManagerJobNumber: '班组长',
            qcJobNumber: 'FQC人员',
            inspectionSubmissionJobNumber: '报检人员',
            inspectionSubmissionDate: '报检日期',
          }
          // 对data进行格式化
          // 取出所有的属性名
          const props = Object.keys(res[0]) // ['id','']
          // 将属性名从英文转为中文
          const header = props.map(zhkey => mapInfo[zhkey])
          console.log('中文的表头', header)
          // const data=[['xxxx','总裁办'，'13800000']]
          const data = res.map(obj => Object.values(obj))
          return { header, data }
        },
        handleDelete(row,index) {
            this.$confirm('这将会永久删除该行数据，是否继续?', '警告', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.delprocess(row,index)
            }).catch(() => {
                this.$message({
                  type: 'info',
                  message: '已取消删除'
                })
            })
        },
        async delprocess(row,index){
          let res = await inspectionFormDel({id: row.id})
          if(res.code == '500') return
          if(res.code != '1') return this.$message.error(res.msg)
          this.tableInfo.splice(index,1)
          this.$message.success(res.msg)
        },
        // 导出excel
        async hExportExcel(e,row) {
          this.loading = true
          let query = {page: 1,limit: 10000}
          if(e == 'XZ'){
            query.id = row.id
        }else {
              if(this.param.type == 1){ query.workCenter = '装配车间'}
                if(this.param.type == 2){ query.workCenter = 'EMS总装车间'}
                if(this.param.clientNumber){ query.clientNumber = this.param.clientNumber}
                if(this.param.sectionNo){ query.sectionNo = this.param.sectionNo}
                if(this.param.produceNo){ query.produceNo = this.param.produceNo}
                if(this.param.version){ query.version = this.param.version}
                if(this.param.deviceBarcode1){ query.deviceBarcode1 = this.param.deviceBarcode1}
                if(this.param.workOrderNo){ query.workOrderNo = this.param.workOrderNo}
                if(this.dateOptions) {
                  if(this.dateOptions.length) {
                      query.startTime = this.dateOptions[0]
                      query.endTime = this.dateOptions[1]
                  }
                }
          }
          let arr = await inspectionFormFind(query)
          if(arr.code == '500') return
          if(arr.code != '1'){
            this.loading = false
            return this.$message.error(errmsg)
          }
          if(!arr.data.list.length){
            this.loading = false
            this.$message.error('暂无数据')
          }
          // 里面有list嵌套关系，需要剥离到最外层来
          // 使用 reduce 和 concat 来生成新数组
          const newData = arr.data.list.reduce((acc, item) => {
            // 对每个 item 的 list 数组进行遍历
            return acc.concat(item.customerInspectionFormDeviceBarcodeList.map(subItem => {
              // 将 subItem 与外层对象的属性合并
              return {
                ...item, // 保留外层对象的所有属性
                ...subItem, // 添加 list 中的属性，注意这里可能会有属性名冲突
                // 如果需要避免属性名冲突，可以显式地选择需要的属性
                // 例如：{ id: item.id, name: item.name, subId: subItem.subId, value: subItem.value }
                // 或者使用更复杂的逻辑来处理冲突
              };
              // 注意：这里我们保留了所有属性，包括可能冲突的 id 和 subId
              // 在实际应用中，你应该根据需要调整属性合并的逻辑
            }));
          }, []);
          console.log('newData',newData)
          const { header, data } = this.transformDat(this.setSort(newData))
          import('@/vendor/Export2Excel').then(excel => {
            // excel表示导入的模块对象
            console.log(excel)
            excel.export_json_to_excel({
            header, // 表头 必填
            data, // 具体数据 必填
            filename: '客户报检单', // 文件名称
            autoWidth: true, // 宽度是否自适应
            bookType: 'xlsx' // 生成的文件类型
            })
          })
          this.loading = false
        },
        // 排序函数
        setSort(arr){
          let newArr = JSON.parse(JSON.stringify(arr))
          let arr1 = []
          newArr.forEach((item,index)=>{
            let obj = {
              index: index+1,
              workCenter: item.workCenter,
              sectionNo: item.sectionNo,
              produceNo: item.produceNo,
              clientNumber: item.clientNumber,
              version: item.version,
              workOrderNo: item.workOrderNo,
              deviceBarcode: item.deviceBarcode,
              planNumber: item.planNumber,
              inspectionSubmissionNumber: item.inspectionSubmissionNumber,
              sectionManagerJobNumber: item.sectionManagerJobNumber,
              qcJobNumber: item.qcJobNumber,
              inspectionSubmissionJobNumber: item.inspectionSubmissionJobNumber,
              inspectionSubmissionDate: item.inspectionSubmissionDate,
            }
            arr1.push(obj)
          })
          return arr1
        },
        cancelSubmit(){
            this.param = {}
            this.listQuery.page = 1
            this.handleFilter()
        },
        resetForm(){
             this.$refs.createForm.resetFields();
        },
    },
    // 进入页面获取table信息
    mounted() {
        this.handleFilter()
    }
}
</script>

<style lang="scss" scoped>
.app-container{
    margin: 10px;
}
/deep/ .el-table__header .el-table-column--selection .cell .el-checkbox:after {
  content: "全选";
  margin-left: 5px;
}
</style>
